<template>
	<view class='member bg-f5 full'>
		<view class='bg-white px30 py15 flex-sc mb10'>
			<image class='portrait u-img-bg circle' alt="">
			<view class='ml10'>
				<view class='f16 bold'>用户昵称</view>
				<!-- <view class='u-f12 u-grey '>8888枚</view> -->
			</view>
		</view>
		
		<ul class='member__ul'>
			<li class='bg-white' :class='{"border-t": index !== 0}' v-for='(item, index) in listData' :key='index'>
				<navigator class='flex-bc px10 py15' :url='item.url'>
					<view>{{item.name}}</view>
					<u-icon name="arrow-right"></u-icon>
				</navigator>
			</li>
		</ul>
		
		<view class='w92 mt20 auto'>
			<u-button type='primary' @click="show = true">退出登录</u-button>
		</view>
		
		<u-modal v-model="show" content="是否退出登录?" :mask-close-able="true" show-cancel-button  @confirm="logOut"></u-modal>
		
		<u-mask :show="show" @click="show = false"></u-mask>
		
	</view>	
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				listData: [
					{ name: '我的钱包', url: 'javascrip:void(0);' },
					{ name: '我的课程', url: 'javascrip:void(0);' },
					{ name: '联系我们', url: '/pages/member/contactUs' },
					{ name: '关于我们', url: 'javascrip:void(0);' },
				],
			};
		},
		methods:{ 
			logOut() {
				uni.removeStorageSync('token')
				uni.redirectTo({
					url: '/pages/login/login',
					animationType: 'slide-in-right',
				})
			}
		}
	}
</script>

<style lang="scss">
.member {
	.portrait {
		width: 120rpx;
		height: 120rpx;
	}
}
</style>
